import { Breadcrumb, Button, Flex, Modal, Radio, message } from "antd";
import styles from "./index.module.less";
import SuperTable from "@/components/SuperTable";
import { DeliveryReturnValues, TableColumns } from "./constant";
import { useState } from "react";
import { deleteShopsAddressApi, getShopsAddressListApi } from "@/api/modules/merchant";
import useUrl from "@/hooks/useUrl";
import { RESULT_CODES } from "@/api/helper/ResultCode";
import { timeStamp } from "console";

export default () => {
	const [params, setParams] = useState({});
	const { query, navigate } = useUrl();
	const shop_id = query.get("shop_id");
	const shop_name = query.get("name");

	const handleRequest = async () => {
		const res = await getShopsAddressListApi({ shop_id });
		return {
			total: res?.total,
			data: res?.data
		};
	};

	const items = [
		{
			title: "所有店铺",
			href: "/merchants"
		},
		{
			title: shop_name,
			className: styles.active
		}
	];

	const handleChangeDefault = (e: Event, record: any, type: number) => {};

	const newTableColumns = [
		{
			title: "发货地址",
			dataIndex: "a",
			width: 140,
			fixed: "left",
			render: (_, record) => {
				const isSentAddress = record.category === DeliveryReturnValues.delivery;
				const isChecked = Boolean(record.is_default);
				if (isSentAddress) {
					return (
						<Radio checked={isChecked} className={styles.custom_radio}>
							{/* onChange={e => handleChangeDefault(e, record, DeliveryReturnValues.delivery)} */}
							默认
						</Radio>
					);
				} else {
					return "-";
				}
			}
		},
		{
			title: "退货地址",
			dataIndex: "cc",
			width: 140,
			fixed: "left",
			render: (_, record) => {
				const isReturnAddress = record.category === DeliveryReturnValues.return;
				const isChecked = Boolean(record.is_default);
				if (isReturnAddress) {
					return (
						<Radio checked={isChecked} className={styles.custom_radio}>
							{/* onChange={e => handleChangeDefault(e, record, DeliveryReturnValues.return)} */}
							默认
						</Radio>
					);
				} else {
					return "-";
				}
			}
		},
		...TableColumns,
		{
			title: "操作",
			dataIndex: "action-render",
			width: 180,
			fixed: "right",
			onClick: (key: string, record: any) => {
				switch (key) {
					case "edit":
						navigate(`/merchants/address/add?shop_id=${shop_id}&id=${record.shop_return_addresses_id}`, {
							state: {
								data: record
							}
						});
						break;
					case "delete":
						Modal.confirm({
							icon: null,
							title: "确认删除该地址？",
							content: "该地址删除后讲无法恢复",
							closable: true,
							onOk: c => {
								deleteShopsAddressApi({
									shop_return_addresses_id: record.shop_return_addresses_id,
									shop_id
								}).then(res => {
									if (res?.code === RESULT_CODES.SUCCESS) {
										message.success("删除成功");
										setParams(e => ({
											timeStamp: Date.now()
										}));
										c?.();
									}
								});
							}
						});

						break;
				}
			},
			options: [
				{
					label: "编辑",
					value: "edit"
				},

				{
					label: "删除",
					value: "delete"
				}
			]
		}
	];

	const handleAdd = () => {
		navigate(`/merchants/address/add?shop_id=${shop_id}`);
	};

	return (
		<div className={styles.container}>
			<Flex justify="space-between" className={styles.header}>
				<Breadcrumb className={styles.breadcrumb} separator=">" items={items} />
				<Button type="primary" onClick={handleAdd}>
					增加地址
				</Button>
			</Flex>
			<SuperTable
				bordered
				pagination={false}
				request={handleRequest}
				params={params}
				columns={newTableColumns}
				scroll={{ x: "900" }}
			/>
		</div>
	);
};
